<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" />
    <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
    <title>修改工单</title>
    <link rel="stylesheet" type="text/css" href="../css/mui.min.css" />
    <link rel="stylesheet" type="text/css" href="../css/common.css" />
    <style type="text/css">
        .detail {
            padding-right: 20px!important;
        }

        h5 {
            color: #0062CC;
        }

        .mui-navigate-right .mui-col-xs-8 {
            width: 62.666667%!important;
        }

        .mui-text-right input,
        .mui-text-right textarea,
        textarea {
            border: 0;
            font-size: 14px;
            font-weight: 400;
            color: #8f8f94;
            margin-bottom: 0;
            text-align: right;
        }

        textarea {
            text-align: left;
        }
    </style>
</head>

<body>
    <div class="mui-content">
    	<ul class="mui-table-view mui-table-view-chevron type_list_spair">
            <li class="mui-table-view-cell detail">
                <div class="mui-table">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">工单编号：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="wonum"></span>
                    </div>
                </div>
            </li>
        </ul>
        <ul class="mui-table-view mui-table-view-chevron type_list_spair">
            <li class="mui-table-view-cell detail">
                <div class="mui-table">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">工单名称：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <input type="text" id="description" placeholder="请输入工单名称" />
                    </div>
                </div>
            </li>
            <li class="mui-table-view-cell detail" onclick="openSaveWin('work_order_sel_workType','选择工单类型')">
                <div class="mui-table mui-navigate-right">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">工单类型：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="workType">请选择工单类型</span>
                    </div>
                </div>
            </li>
        </ul>
        <ul class="mui-table-view mui-table-view-chevron type_list_spair">
            <li class="mui-table-view-cell detail" onclick="openSaveWin('work_order_sel_address','选择位置')">
                <div class="mui-table mui-navigate-right">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">位置：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="location">请选择位置</span>
                    </div>
                </div>
            </li>
            <li class="mui-table-view-cell detail">
                <div class="mui-table">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">位置描述：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="locationDesc"></span>
                    </div>
                </div>
            </li>
        </ul>
        <ul class="mui-table-view mui-table-view-chevron type_list_spair">
            <li class="mui-table-view-cell detail" onclick="openSaveWin('work_order_sel_property','选择资产')">
                <div class="mui-table mui-navigate-right">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">资产：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="assetnum">请选择资产</span>
                    </div>
                </div>
            </li>
            <li class="mui-table-view-cell detail">
                <div class="mui-table">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">资产名称：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="assetDesc"></span>
                    </div>
                </div>
            </li>
        </ul>
        <ul class="mui-table-view mui-table-view-chevron type_list_spair">
            <li class="mui-table-view-cell detail" onclick="openSaveWin('work_order_sel_fixArea','选择维修区域')">
                <div class="mui-table mui-navigate-right">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">维修区域：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="cRegion">请选择维修区域</span>
                    </div>
                </div>
            </li>
            <li class="mui-table-view-cell detail" onclick="openSaveWin('work_order_sel_manager','选择负责人',{lead: true})">
                <div class="mui-table mui-navigate-right">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">负责人：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="leadName">请选择负责人</span>
                    </div>
                </div>
            </li>
            <li class="mui-table-view-cell detail" onclick="openSaveWin('work_order_sel_manager','选择主管人',{manager:true})">
                <div class="mui-table mui-navigate-right">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">主管人：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="supervisorName">请选择主管人</span>
                    </div>
                </div>
            </li>
        </ul>
        <ul class="mui-table-view mui-table-view-chevron type_list_spair">
            <li class="mui-table-view-cell detail">
                <div class="mui-table">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">上传图片：</h5>
                    </div>
                </div>
                <div class="mui-table">
                    <ul class="mui-table-view mui-grid-view mui-grid-9 type_list_spair" id="imgList">
                        <!-- 模板引擎 -->
                        <li id="liAddPhoto" class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" tapmode onclick="invokePictureTaker()"><img src="../image/upload.png" /></li>
                    </ul>
                </div>
            </li>
        </ul>
    </div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script src="../script/mui.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../script/common.js" type="text/javascript" charset="utf-8"></script>
<script src="../script/template.js" type="text/javascript" charset="utf-8"></script>
<script type="text/temmlate" id="tmpList">
  {{each datas as item}}
    <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" tapmode onclick="showRemotePicture(baseURL + 'downloadFile?docinfoid='+'{{item.docinfoid}}', '{{item.description}}')">
      <img class="mui-media-object" src="{{item.src}}"/>
    </li>
  {{/each}}
</script>
<script type="text/javascript">
    var idList = [],lead,supervisor;
    apiready = function() {
        onLoadData()
        // 选择位置
        api.addEventListener({
            name: 'LocactionId'
        }, function(resp, err) {
            $api.html($api.byId('location'), resp.value.locationName)
            $api.html($api.byId('locationDesc'), resp.value.Location)
            $api.html($api.byId('cRegion'), resp.value.c_region);
            ajaxrd("selectUserList", {
                cRegion: resp.value.c_region
            }, function(ret, err) {
              if(ret.list.length) {
                $api.html($api.byId('leadName'), ret.list[0].displayname)
                lead = ret.list[0].loginid
              }
            })
            ajaxrd("selectAssetList", {
                location: resp.value.locationName
            }, function(ret, err) {
              if (ret.list.length) {
                $api.text($api.byId('assetnum'), ret.list[0].assetnum)
                $api.text($api.byId('assetDesc'), ret.list[0].description)
              }
            })
        });
        // 选择资产
        api.addEventListener({
            name: 'PropertyId'
        }, function(ret, err) {
            $api.html($api.byId('assetnum'), ret.value.propertyId)
            $api.html($api.byId('assetDesc'), ret.value.description)
        });
        // 选择负责人
        api.addEventListener({
            name: 'lead'
        }, function(ret, err) {
        	lead = ret.value.userID
            $api.html($api.byId('leadName'), ret.value.userName)
        })
        // 选择管理人
        api.addEventListener({
            name: 'ManagerCh'
        }, function(ret, err) {
        	supervisor = ret.value.userID
            $api.html($api.byId('supervisorName'), ret.value.userName)
        })
        // 选择工单类型
        api.addEventListener({
            name: 'workType'
        }, function(ret, err) {
            $api.html($api.byId('workType'), ret.value.workType)
        })
        // 选择维修区域
        api.addEventListener({
            name: 'fixArea'
        }, function(ret, err) {
            $api.html($api.byId('cRegion'), ret.value.fixAreaValue)
        })
        api.addEventListener({
            name: 'navitembtn'
        }, function(ret, err) {
            if (ret.index == 0) {
                if ($api.val($api.byId('description')) == '') {
                    Toast('请输入工单名称！');
                    return
                }
                if ($api.text($api.byId('worktype')) == '') {
                    Toast('请选择工单类型！');
                    return
                }
                if ($api.text($api.byId('location')) == '') {
                    Toast('请选择位置！');
                    return
                }
                if ($api.text($api.byId('assetnum')) == '') {
                    Toast('请选择资产！');
                    return
                }
                if ($api.text($api.byId('cRegion')) == '') {
                    Toast('请选择维修区域！');
                    return
                }
                if (lead == '' || lead==null) {
                    Toast('请选择负责人！');
                    return
                }
                if (supervisor == '' || supervisor==null) {
                    Toast('请选择主管人！');
                    return
                }
                ajaxrd("updateWorkOrder", {
                    workorderid : api.pageParam.workorderid,
                    description:$api.val($api.byId('description')),
                    worktype:$api.text($api.byId('workType')),
                    location:$api.text($api.byId('location')),
                    assetnum:$api.text($api.byId('assetnum')),
                    cRegion:$api.text($api.byId('cRegion')),
                    lead:lead,
                    supervisor:supervisor,
                    imgages: idList,
                }, function(ret, err) {
                    api.sendEvent({
                        name: 'onload',
                        extra: {
                            isrefersh: 'yes'
                        }
                    });
                    Toast('修改成功！');
                    setTimeout(function() {
                        api.closeWin();
                    }, 100)
                })
            } else { //扫码

            }
        });
    }

    //调用拍照功能
    function invokePictureTaker() {
        takePicture(function(localImgFile, id, id_sl) {
            //存储已拍照的照片
             idList.push({
               docinfoid: id,
               docinfoid_sl: id_sl,
             })
            //上传成功，则将照片加到列表中
            var liAddPhoto = $api.byId('liAddPhoto');
            $api.before(liAddPhoto, "<li class='mui-table-view-cell mui-media mui-col-xs-3' tapmode onclick=\"showLocalPicture('" + localImgFile + "')\">" +
                "<img class='mui-media-object' src='" + localImgFile + "'>" + "</li>");
            api.parseTapmode();
        });
    }
    function onLoadData () {
  		ajaxrd("queryOrderDetail", {
  			workorderid: api.pageParam.workorderid,
  			wonum:api.pageParam.wonum
  		}, function(ret, err) {
  			api.refreshHeaderLoadDone();
  			$api.text($api.byId('wonum'),ret.wonum)
        	$api.val($api.byId('description'),ret.taskDesc)
	        $api.text($api.byId('workType'),ret.worktype)
	        $api.text($api.byId('location'),ret.location)
	        $api.text($api.byId('locationDesc'),ret.locationDesc)
	        $api.text($api.byId('assetnum'),ret.assetnum)
	        $api.text($api.byId('assetDesc'),ret.assetDesc)
	        $api.text($api.byId('cRegion'),ret.cRegion)
	        lead = ret.lead;
	        $api.text($api.byId('leadName'),ret.lead+'/'+ret.leadName)
	        supervisor =ret.supervisor;
	        $api.text($api.byId('supervisorName'),ret.supervisor+'/'+ret.supervisorName)
	        var arr = []
          if(ret.imgList.length){
            for(var item of ret.imgList){
              idList.push({
                docinfoid: item.docinfoid,
                docinfoid_sl: item.docinfoid_sl
              })
              arr.push({
                docinfoid:item.docinfoid,
                description:item.description,
                src:baseURL+'downloadFile?docinfoid='+item.docinfoid_sl
              })
            }
            var html =  template('tmpList',{datas:arr});
            $api.html($api.byId('imgList'),html);
          }
  		})
  	}
</script>

</html>
